<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Test SVG mask</title>
	<script>
		var dojoConfig = {
			async: true,
			isDebug: true,
			packageMap: [{
					name: 'doh',
					location: 'util/doh'
			}],
			gfxRenderer: 'svg'
		}
	</script>
	<script type="text/javascript" src="../../../dojo/dojo.js"></script>
	<script type="text/javascript">
		require([
			"doh/runner",
			"dojox/gfx",
			"dojox/gfx/svg_mask",
			'dojo/domReady!'
		], function(doh, gfx){

			var surface = null;
			function setUpSurface(){
				surface = gfx.createSurface('canvas', 500, 500);
			}
			function tearDownSurface(){
				surface.destroy();
				surface = null;
			}

			doh.register("svg.mask", [
				{
					name: "Surface.createMask",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});
						doh.assertTrue(mask.parent = surface);
						doh.assertTrue(mask.rawNode.parentNode === surface.defNode);
					}
				},{
					name: "Shape.setMask(mask)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var rect = surface.createRect({}),
							mask = surface.createMask({});

						doh.assertEqual(null, rect.getMask());
						rect.setMask(mask);
						doh.assertEqual(mask, rect.getMask());
						doh.assertEqual('url(#' + mask.shape.id + ')', rect.rawNode.getAttribute('mask'));
					}
				},{
					name: "Shape.setMask(null)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var rect = surface.createRect({}),
							mask = surface.createMask({});

						doh.assertEqual(null, rect.getMask());
						rect.setMask(mask);
						doh.assertEqual(mask, rect.getMask());
						rect.setMask(null);
						doh.assertEqual(null, rect.getMask());
						doh.assertFalse(rect.rawNode.hasAttribute('mask'));
					}
				},{
					name: "Mask.setShape(shapeWithId)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});

						var shape = {
							id: 'a-mask-id',
							x: 1,
							y: 2,
							width: 3,
							height: 4
						};
						mask.setShape(shape);
						
						var rawNode = mask.rawNode;
						for(var key in shape){
							doh.assertEqual(shape[key], rawNode.getAttribute(key));
						}
					}
				},{
					name: "Mask.setShape(shapeWithoutId)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});

						var shape = {
							x: 1,
							y: 2,
							width: 3,
							height: 4
						};
						mask.setShape(shape);

						var actualShape = mask.getShape();
						doh.assertTrue('id' in actualShape);
						doh.assertEqual(actualShape.id, mask.rawNode.getAttribute('id'));
					}
				},{
					name: "Surface.remove(mask)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});
						surface.remove(mask);
						doh.assertEqual(null, mask.parent);
						doh.assertEqual(null, mask.rawNode.parentNode);
					}
				},{
					name: "Surface.add(mask)",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});
						surface.remove(mask);
						surface.add(mask);
						doh.assertEqual(surface, mask.parent);
						doh.assertEqual(surface.defNode, mask.rawNode.parentNode);
					}
				},
				{
					name: "Mask.createXxx/add/remove",
					setUp: setUpSurface,
					tearDown: tearDownSurface,
					runTest: function(t){
						var mask = surface.createMask({});
						var rect = mask.createRect({});
						doh.assertEqual(mask, rect.getParent());
						mask.remove(rect);
						doh.assertEqual(null, rect.getParent());
						mask.add(rect);
						doh.assertEqual(mask, rect.getParent());
					}
				}
			]);
			doh.run();
		});
	</script>
</head>
<body>
<div id="canvas"></div>
</body>
</html>
